<template>
	<div class="prove">
		<div class="black">
			<div class="cont">
				<h4>
					<span @click="emit('foodShow', false)"></span
					><!-- react-text: 2974 -->食品安全监督公示<!-- /react-text -->
				</h4>
				<div class="line"></div>
				<div class="info clear"><div class="left"></div></div>
				<h4>商家资质公示</h4>
				<div class="line"></div>
				<div class="id">
					<ul class="clear">
						<li>
							<p>营业执照</p>
							<div class="bgF">
								<img
									src="https://s3plus-img.sankuai.com/skynet/4E6D39561622B0B67C9F1222914895A2.png%40600h%7Cwatermark%3D1%26align%3D1%26x%3D20%26object%3Dd2F0ZXJtYXJrLTIwMTYxMTEwMS5wbmc%3D%0A%26p%3D5%26t%3D15%26order%3D0?AWSAccessKeyId=c64763be32f940a49e91fac6670f2fff&amp;Expires=1646534952&amp;Signature=Li5ItYQfcaTFaRpgH9HKaEwdvc0%3D"
								/>
							</div>
						</li>
						<li>
							<p>餐饮服务许可证</p>
							<div class="bgF">
								<img
									src="https://s3plus-img.sankuai.com/skynet/https%3A/%2Fs3plus-img.sankuai.com/attachment/62115ab0-cfed-4351-9d8f-03efba5b29ee%2540watermark%253D2%2526type%253Dd3F5LW1pY3JvaGVp%2526size%253D50%2526x%253D100%2526y%253D50%2526color%253DI0VFRUVFRQ%253D%253D%2526p%253D9%2526t%253D20%2526f%253D1%2526a%253D-30%2526rn%253D3%2526sn%253D10%2526voffset%253D50%2526text%253D5LuF6ZmQ576O5Zui5L2_55So%3FAWSAccessKeyId%3D50df5a501ec84b81ab52bd50306477e1%26Expires%3D2576993201%26Signature%3DGLDYsFAquNHkeKF5aE0SoLw7Pwo%253D%40600h%7Cwatermark%3D1%26align%3D1%26x%3D20%26object%3Dd2F0ZXJtYXJrLTIwMTYxMTEwMS5wbmc%3D%0A%26p%3D5%26t%3D15%26order%3D0?AWSAccessKeyId=c64763be32f940a49e91fac6670f2fff&amp;Expires=1646534952&amp;Signature=pax7rk%2FTFF3GheVrzZDlnbc%2FIA8%3D"
								/>
							</div>
						</li>
					</ul>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
import { defineComponent, defineEmits } from 'vue'
export default defineComponent({
	name: 'Foot',
})
</script>

<script setup>
const emit = defineEmits(['foodShow'])
</script>
<style lang="less" scoped>
.prove {
	position: fixed;
	top: 70px;
	width: 660px;
	z-index: 9999;
	left: 50%;
	margin-left: -330px;
	color: #333;
	.black {
		background: rgba(0, 0, 0, 0.3);
		padding: 10px;

		.cont {
			background-color: #fff;
			padding: 17px 20px 33px;
			height: 372px;
			.id {
				padding-top: 8px;
				li {
					width: 280px;
					float: left;
					margin-right: 20px;
					.bgF {
						background-color: #fafafa;
						border: 1px solid #eee;
						padding: 10px 11px;
						height: 180px;
						img {
							display: block;
							width: 100%;
							height: 100%;
							border-radius: 4px;
						}
					}
					p {
						font-size: 12px;
						line-height: 17px;
						margin-bottom: 7px;
					}
				}
			}
			.info {
				padding: 6px 0 24px;
				.left {
					//float: left;
					//max-width: 440px;
					font-size: 12px;
					line-height: 17px;
				}
			}
			.line {
				height: 1px;
				overflow: hidden;
				border-bottom: 1px solid #e5e5e5;
			}
			h4 {
				font-size: 14px;
				line-height: 20px;
				margin-bottom: 7px;
				span {
					float: right;
					width: 16px;
					height: 16px;
					background-image: url(../../../../assets/image/cancel.png);
					background-size: 100% 100%;
					cursor: pointer;
				}
			}
		}
	}
}
</style>
